<template>
  <j-modal
    :title="title"
    :width="width"
    :visible="visible"
    switchFullscreen
    :fullscreen="true"
    @ok="handleOk"
    :okButtonProps="{ class:{'jee-hidden': disableSubmit} }"
    @cancel="handleCancel"
    cancelText="关闭">
    <template #footer>
      <el-button @click="handleCancel">取 消</el-button>
      <el-button @click="handleOk">保 存</el-button>
      <el-button v-if="currentRecord.productStatus === 1" type="primary" @click="handleProcessChange(2)">提交审批</el-button>
      <el-button v-if="currentRecord.productStatus === 3" type="primary" @click="handleProcessChange(4)">提交查重</el-button>
    </template>
    <product-library-sku-form ref="realForm" @ok="submitCallback" :disabled="disableSubmit"></product-library-sku-form>
  </j-modal>
</template>

<script>

  import ProductLibrarySkuForm from './ProductLibrarySkuForm'
  export default {
    name: 'ProductLibrarySkuModal',
    components: {
      ProductLibrarySkuForm
    },
    data () {
      return {
        title:'',
        width:1200,
        visible: false,
        disableSubmit: false,
        currentRecord: {}
      }
    },
    methods: {
      add () {
        this.visible=true
        this.$nextTick(()=>{
          this.$refs.realForm.add();
        })
      },
      edit (record) {
        this.currentRecord = record;
        this.visible=true
        this.$nextTick(()=>{
          this.$refs.realForm.edit(record);
        })
      },
      close () {
        this.$emit('close');
        this.visible = false;
      },
      handleOk () {
        this.$refs.realForm.submitForm();
      },
      submitCallback(){
        this.$emit('ok');
        this.visible = false;
      },
      handleCancel () {
        this.close()
      },
      handleProcessChange(type){
        this.$refs.realForm.handleProcessChange(type);
      }
    }
  }
</script>

<style lang="less" scoped>
.j-modal-box /deep/.ant-modal{
  .table-sort-content-parent{
    background:#ECECEC; 
    padding:16px; 
    .table-sort-content{
      height: calc(100vh - 400px); 
      overflow-y: auto;
      &::-webkit-scrollbar {
        display: none;
      }
    }
  }
}
.j-modal-box.fullscreen /deep/.ant-modal {
  .table-sort-content{
    height: 71vh;
  }
}
.j-modal-box.fullscreen /deep/.ant-modal-content .ant-modal-body {
  height: calc(100% - 120px);
}
</style>